<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>同咨科技-商户后台</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="../../static/css/weadmin.css">
    <link href="../../lib/layui/css/layui.css" rel="stylesheet">

    <script type="text/javascript" src="../../lib/layui/layui.js" charset="utf-8"></script>
    <script type="module" src="../components/use-body.js"></script>



    <link href="../../static/css/cost.css" rel="stylesheet">
    <link href="../../static/css/uselay.css" rel="stylesheet">
</head>

<body>
    <use-body>
        <div class="page-body cost module">
            <div class="page-border">
                <div class="layui-tab layui-tab-brief">
                    <ul class="layui-tab-title">
                        <li class="layui-this">新建模块基本信息</li>
                        <li>模块分部分项清单</li>
                        <li>模块材料汇总表</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">
                            <form class="layui-form layui-form546" action="">
                                <div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label required">模块名称</label>
                                        <div class="layui-input-block">
                                            <input type="text" name="username" lay-verify="required"
                                                placeholder="输入模块名称" autocomplete="off" class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">模块简介</label>
                                        <div class="layui-input-block">
                                            <textarea placeholder="请输入造价模块简介" class="layui-textarea"></textarea>
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label required">工程量单位</label>
                                        <div class="layui-input-block">
                                            <input type="text" name="username" lay-verify="required"
                                                placeholder="输入工程量单位" autocomplete="off" class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label required">工程规模</label>
                                        <div class="layui-input-block">
                                            <input type="text" name="username" lay-verify="required"
                                                placeholder="输入工程规模" autocomplete="off" class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label required">编制人</label>
                                        <div class="layui-input-block">
                                            <input type="text" name="username" lay-verify="required" placeholder="输入编制人"
                                                autocomplete="off" class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label required">工程类别</label>
                                        <div class="layui-input-block">
                                            <input type="text" name="username" lay-verify="required"
                                                placeholder="输入工程类别" autocomplete="off" class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label required">地区及时间</label>
                                        <div class="layui-input-block">
                                            <div class="layui-col-space10">
                                                <div class="layui-col-md6">
                                                    <input type="text" class="layui-input" id="ID-laydate-demo"
                                                        placeholder="请选择年/月">
                                                </div>
                                                <div class="layui-col-md6">
                                                    <select lay-verify="required"></select>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label required">计价依据</label>
                                        <div class="layui-input-block">
                                            <div class="layui-col-space10">
                                                <div class="layui-col-md4">
                                                    <select lay-verify="required"></select>
                                                </div>
                                                <div class="layui-col-md4">
                                                    <input type="text" lay-verify="required" name="username"
                                                        placeholder="输入计价依据" autocomplete="off" class="layui-input">
                                                </div>
                                                <div class="layui-col-md4">
                                                    <input type="text" lay-verify="required" name="username"
                                                        placeholder="输入版本号" autocomplete="off" class="layui-input">
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label required">选择阶段</label>
                                        <div class="layui-input-block">
                                            <select lay-verify="required"></select>
                                        </div>
                                    </div>
                                </div>
                                <div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label required">计税方法</label>
                                        <div class="layui-input-block">
                                            <select lay-verify="required"></select>
                                        </div>
                                    </div>

                                    <div class="layui-form-item">
                                        <label class="layui-form-label">关键词</label>
                                        <div class="layui-input-block">
                                            <input type="text" name="username" placeholder="请输入关键词" autocomplete="off"
                                                class="layui-input">
                                        </div>
                                    </div>
                                </div>
                            </form>
                            <div class="layui-btn-center">
                                <button type="button" class="layui-btn btn-text">取消</button>
                                <button type="button" class="layui-btn layui-btn-radius">保存设置</button>
                            </div>
                        </div>
                        <div class="layui-tab-item">
                            <table class="layui-form layui-table layui-table-bg" style="margin-top: 20px;" lay-skin="nob">
                                <thead>
                                    <tr>
                                        <th><input type="checkbox" name="AAA"></th>
                                        <th>序号</th>
                                        <th>清单编号</th>
                                        <th>清单名称</th>
                                        <th>清单特征</th>
                                        <th>单位</th>
                                        <th>工程量</th>
                                        <th>全费用单价</th>
                                        <th>全费用合价</th>
                                        <th>其中：暂估价</th>
                                        <th>总价措施费</th>
                                        <th>其中：安全文明费</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td colspan="3"></td>
                                        <td><strong>围墙基础</strong></td>
                                        <td colspan="7"></td>
                                    </tr>
                                    <tr>
                                        <td>1</td>
                                        <td>1</td>
                                        <td>穷则独善其身，达则兼济天下</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td><input type="text" style="width: 90px;margin: 0 auto;" name="username"
                                                placeholder="请输入" autocomplete="off" class="layui-input"></td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏1</td>
                                    </tr>
                                    <tr>
                                        <td colspan="12" style="text-align: center;">
                                            <div class="table-add-btn">
                                                <i class="iconfont use-add"></i>
                                                添加
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="8">小 计</td>
                                        <td>704.86</td>
                                        <td colspan="3"></td>
                                    </tr>
                                </tbody>
                            </table>

                            <table class="layui-form layui-table layui-table-bg" lay-skin="nob">
                                <tbody>
                                    <tr>
                                        <td colspan="3"></td>
                                        <td><strong>小节名称</strong></td>
                                        <td colspan="7"></td>
                                    </tr>
                                    <tr>
                                        <td><input type="checkbox" name="AAA"></td>
                                        <td>1</td>
                                        <td>穷则独善其身，达则兼济天下</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td><input type="text" style="width: 90px;margin: 0 auto;" name="username"
                                                placeholder="请输入" autocomplete="off" class="layui-input"></td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏1</td>
                                    </tr>
                                    <tr>
                                        <td colspan="12" style="text-align: center;">
                                            <div class="table-add-btn">
                                                <i class="iconfont use-add"></i>
                                                添加
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="8">小 计</td>
                                        <td>704.86</td>
                                        <td colspan="3"></td>
                                    </tr>
                                </tbody>
                            </table>

                            <div class="layui-btn-center">
                                <button type="button" class="layui-btn btn-text">取消</button>
                                <button type="button" class="layui-btn layui-btn-radius">保存设置</button>
                            </div>
                        </div>
                        <div class="layui-tab-item">
                            <table class="layui-form layui-table layui-table-bg" style="margin-top: 20px;" lay-skin="nob">
                                <thead>
                                    <tr>
                                        <th>序号</th>
                                        <th>材料编码</th>
                                        <th>材料设备名称型号</th>
                                        <th>单位</th>
                                        <th>数量</th>
                                        <th>单价基价（元）</th>
                                        <th>合价（元）</th>
                                        <th>是否暂估价</th>
                                        <th>暂估价（元）</th>
                                        <th>基价期</th>
                                        <th>备注</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td><input type="checkbox" name="AAA"></td>
                                        <td>1</td>
                                        <td>穷则独善其身，达则兼济天下</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏</td>
                                        <td>华夏1</td>
                                    </tr>
                                    <tr>
                                        <td colspan="6">小 计</td>
                                        <td>704.86</td>
                                        <td></td>
                                        <td>704.86</td>
                                        <td></td>
                                        <td></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </use-body>
</body>
<script>
    layui.use('table', function () {
        var $ = layui.$;
        var table = layui.table;
        var util = layui.util;
        var form = layui.form;
        var upload = layui.upload;
        var laydate = layui.laydate;
        laydate.render({
            elem: '#ID-laydate-range',
            range: ['#ID-laydate-start-date', '#ID-laydate-end-date']
        });
        util.on('lay-on', {
            'add-dialog': function () {
                layer.open({
                    type: 1,
                    shade: false, // 不显示遮罩
                    content: $('#ID-test-layer-wrapper'), // 捕获的元素
                    title: '新建任务',
                    closeBtn: 1,
                    end: function () {
                        // layer.msg('关闭后的回调', {icon:6});
                    }
                });
            },
        })

        // 已知数据渲染
        var inst = table.render({
            elem: '#ID-table-demo-data',
            cols: [[ //标题栏
                { type: 'checkbox', fixed: 'center' },
                { field: 'id', title: '清单编号', align: 'center', width: 100 },
                { field: 'username', title: '清单名称', align: 'center', width: 100 },
                { field: 'username', title: '清单特征', align: 'center', width: 100 },
                { field: 'username', title: '单位', align: 'center', width: 100 },
                { field: 'username', title: '工程量', align: 'center', width: 100 },
                { field: 'username', title: '全费用单价', align: 'center', width: 100 },
                { field: 'username', title: '全费用合价', align: 'center', width: 100 },
                { field: 'username', title: '其中：暂估价', align: 'center', width: 100 },
                { field: 'username', title: '总价措施费', align: 'center', width: 100 },
                { field: 'username', title: '其中：安全文明费', align: 'center', width: 100 },
                { field: 'username', title: '规费', align: 'center', width: 100 },
                { field: 'username', title: '税金及附加', align: 'center', width: 100 },
                { field: 'username', title: '清单特征', align: 'center', width: 440, templet: '#ID-table-demo-css-user' },
                { fixed: 'right', field: 'username', title: '操作', toolbar: '#operate-btn', align: 'center' },
            ]],
            data: [{ // 赋值已知数据
                "id": "10001",
                "username": "张三1",
                "sex": "男",
                "city": "浙江杭州",
                "sign": "人生恰似一场修行",
                "experience": "116"
            }, {
                "id": "10002",
                "username": "张三2",
                "sex": "男",
                "city": "浙江杭州",
                "sign": "人生恰似一场修行",
                "experience": "12",
                "LAY_CHECKED": true
            }, {
                "id": "10003",
                "username": "张三3",
                "sex": "男",
                "city": "浙江杭州",
                "sign": "人生恰似一场修行",
                "experience": "65"
            }, {
                "id": "10004",
                "username": "张三4",
                "sex": "男",
                "city": "浙江杭州",
                "sign": "人生恰似一场修行",
                "experience": "777"
            }, {
                "id": "10005",
                "username": "张三5",
                "sex": "男",
                "city": "浙江杭州",
                "sign": "人生恰似一场修行",
                "experience": "86"
            }, {
                "id": "10006",
                "username": "张三6",
                "sex": "男",
                "city": "浙江杭州",
                "sign": "人生恰似一场修行",
                "experience": "12"
            }, {
                "id": "10007",
                "username": "张三7",
                "sex": "男",
                "city": "浙江杭州",
                "sign": "人生恰似一场修行",
                "experience": "16"
            }, {
                "id": "10008",
                "username": "张三8",
                "sex": "男",
                "city": "浙江杭州",
                "sign": "人生恰似一场修行",
                "experience": "106"
            }],
            skin: 'nob', // 表格风格
            //even: true,
            page: false
        });


        laydate.render({
            elem: '.laydate'
        });

        $('.collapseBtn').click(function () {
            $(this).find('.layui-icon').toggleClass('layui-icon-down')
            $('.filters .item').each(function (index, i) {
                if (index > 2) {
                    $(i).toggle()
                }
            })
        })

        $('.layui-table-sort-asc').click(function () {
            $(this).parent().attr("lay-sort", "asc")
        })

        $('.layui-table-sort-desc').click(function () {
            $(this).parent().attr("lay-sort", "desc")
        })
    });
</script>

</html>